<template>
  <div>
    <el-tree
      ref="tree"
      :data="list"
      :props="{ label: 'name' }"
      show-checkbox
      check-strictly
      default-expand-all
      node-key="id"
    />
    <el-button type="primary" size="mini">取消</el-button>
    <el-button type="primary" size="mini" @click="hSubmit">确定</el-button>

  </div>
</template>

<script>
import { getPermission } from '@/api/permissions'
import { newArr } from '@/utils/ping'
import { getRoleDetail, assignPerm } from '@/api/settings'
export default {
  name: 'VueWhZr3AssignPermission',
  props: {
    curId: {
      type: String,
      required: true
    }
  },

  data() {
    return {
      list: [],
      permIds: []
    }
  },
  created() {
    this.lodePermission()
  },
  methods: {

    async hSubmit() {
      try {
        this.permIds = this.$refs.tree.getCheckedKeys()
        const res = await assignPerm({ id: this.curId, permIds: this.permIds })
        if (res.code === 10000) {
          this.$emit('succer')
        }
      } catch (error) {
        console.log(error)
      }
    },

    async lodePermission() {
      try {
        const res = await getPermission()
        const del = await getRoleDetail(this.curId)
        console.log('getRoleDetail', del)
        // 保存数据
        this.list = newArr(res.data)
        this.$refs.tree.setCheckedKeys(del.data.permIds)
      } catch (err) {
        console.log('getPermission', err)
      }
    }
  }
}
</script>

<style lang="scss" scoped>

</style>
